<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="description" content="对网页的一段概括性描述" />
		<meta name="keywords" content="关键字1,关键字2,关键字3..." />
		<meta name="renderer" content="webkit">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>欣赏</title>
		<!--公共样式-->
		<link rel="stylesheet" type="text/css" href="../css/see.css" />
		<link href="http://cdn.bootcss.com/normalize/5.0.0/normalize.css" rel="stylesheet">
		<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css" />
		<script src="vendor/jquery.min.js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="vendor/bootstrapt/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="http://dup.baidustatic.com/js/ds.js"></script>
		<!--[if lt IE 9]>
			<script src="http://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
			<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->
	</head>

	<body>
		<!--登录注册-->
		<div class="Main" id="main">
			<div class="login" id="rigest">
				<span class="change" id="change2">
					切换
				</span>
				<span class="Close" id="close2">
					关闭
				</span>
				<h1>这是注册界面</h1>
			</div>
			<div class="login" id="login">
				<span class="change" id="change1">
					切换
				</span>
				<span class="Close" id="close1">
					关闭
				</span>
				<h1>这是登录界面</h1>
			</div>
		</div>
		<!--导航栏-->
		<header id="header">
			<div class="content">
				<div class="nav">
					<ul class="nav-menu">
						<li class="nav-toggle">
							<i class="fa" id="menu" style="left: 18px;">
								<span></span>
								<span></span>
								<span></span>
							</i>
						</li>
						<li class="signin-toggle">
							<a href="#" style="color: white;">
								<i class="glyphicon glyphicon-user"></i>
							</a>
						</li>
						<li class="home-logo">
							<a href="../index.html">
								<span class="text-replace">觉唯设计</span>
							</a>
						</li>
					</ul>
					<ul class="nav-list clearfix" id="navList">
						<li id="logo">
							<a href="../index.html"><span class="text-replace"></span></a>
						</li>
						<li>
							<a href="article.html" class="jw-nav-item" style="padding-right: 0; opacity: 0.7;">文章</a>
						</li>
						<li>
							<a href="#" class="jw-nav-item">欣赏</a>
						</li>
						<li>
							<a href="matelrial.html" class="jw-nav-item">素材</a>
						</li>
						<li>
							<a href="exchange.html" class="jw-nav-item">兑换</a>
						</li>
						<li>
							<a href="active.html" class="jw-nav-item">活动</a>
						</li>
						<li>
							<a href="weiran.html" class="jw-nav-item">唯然</a>
						</li>
						<li>
							<a href="aboutjiawin.html" class="jw-nav-item">更多</a>
							<ul class="sub-menu">
								<li>
									<a href="aboutjiawin.html">关于觉唯</a>
								</li>
								<li>
									<a href="aboutjiawin1.html">留言联系</a>
								</li>
							</ul>
						</li>
						<li id="login-reg">
							<div>
								<a id="login1" href="#" class="user-signin jw-nav-item">登录</a>
							</div>
							<div>
								<a id="rigest1" href="#" class="user-reg jw-nav-item">注册</a>
							</div>
						</li>
						<li id="search" style="padding: 0 13px;">
							<form action="" method="post">
								<div class="search-input-wrapper">
									<span class="search-icon">
										<i class="fa glyphicon glyphicon-search"></i>
									</span>
								</div>
							</form>
						</li>
					</ul>
				</div>
			</div>
		</header>

		<!--content-->
		<div id="container">
			<div class="content">
				<div id="guide">
					<div class="group">
						<ul>
							<li>
								<a href="#">
									<i class="glyphicon glyphicon-bookmark"></i> &nbsp;不限类别&nbsp;
									<span class="screde1"><i class="screde"></i></span>
								</a>
								<ul class="sub">
									<li>
										<a href="#">平面设计</a>
									</li>
									<li>
										<a href="#">摄影艺术</a>
									</li>
									<li>
										<a href="#">绘画艺术</a>
									</li>
									<li>
										<a href="#">3D艺术</a>
									</li>
									<li>
										<a href="#">酷站欣赏</a>
									</li>
									<li>
										<a href="#">空间设计</a>
									</li>
									<li>
										<a href="#">工业设计</a>
									</li>
									<li>
										<a href="#">交互设计</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#">
									<i class="glyphicon glyphicon-bookmark"></i> &nbsp;最新发布&nbsp;
									<span class="screde1"><i class="screde"></i></span>
								</a>
								<ul class="sub">
									<li>
										<a href="#">喜欢最多</a>
									</li>
									<li>
										<a href="#">浏览最多</a>
									</li>
									<li>
										<a href="#">评论最多</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#">
									<i class="glyphicon glyphicon-time"></i> &nbsp;不限时间&nbsp;
									<span class="screde1"><i class="screde"></i></span>
								</a>
								<ul class="sub">
									<li>
										<a href="#">一周内</a>
									</li>
									<li>
										<a href="#">一月内</a>
									</li>
									<li>
										<a href="#">一年内</a>
									</li>
								</ul>
							</li>
						</ul>
					</div>
				</div>

			</div>
			<section id="cool">
				<div class="content grid">
					<ul class="drid-ul">
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container1.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container2.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container3.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container4.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container5.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container6.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container7.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container8.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container9.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container10.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container11.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container12.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container13.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container14.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
						<div class="grid-wraper">
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container15.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
							<li>
								<div class="item">
									<div class="thumb">
										<a href="#"><img style="transition: all 0.5s;" width="280px" height="180px" src="../images/container16.jpg" /></a>
									</div>
									<div class="meta">
										<div class="title">
											<h2 style="margin-top: 10px;"><a href="#" class="meta-title-item">日本插画师花瀬：漂亮的和服题材插画</a></h2>
										</div>
										<div class="extra">
											<i class="glyphicon glyphicon-bookmark"></i>
											<a href="#">绘画艺术</a>
											<span>680<i class="glyphicon glyphicon-leaf"></i></span>
										</div>
									</div>
									<div class="data">
										<time>2016-08-22</time>
										<span><a href="#"><i class="glyphicon glyphicon-comment"></i>1</a></span>
										<span><i class="glyphicon glyphicon-heart"></i>3</span>
									</div>
								</div>
							</li>
						</div>
					</ul>
					<ul id="cncw-page">
						<li class="box-shadow" style="background: #00C3B6;color: white;">1</li>
						<li class="active box-shadow">2</li>
						<li style="background: none; box-shadow: 0px 0px 0px 0px none;color: #555555;">...</li>
						<li class="active box-shadow">20</li>
						<li class="active box-shadow"><i class="glyphicon glyphicon-chevron-right"></i></li>
						<li style="background: none; box-shadow: 0px 0px 0px 0px none;color: #555555;">共20页</li>
						<li class="active box-shadow" style="background: #00C3B6;padding: 1px;height: 35px;"><input type="text" value="1" style="height: 33px;width: 50px;border-radius: 5px;text-align: center;color: #555555;" /><input type="submit" value="Go" style="height: 33px;width: 40px;border-radius: 5px;background: #00C3B6;color: white;" /></li>
					</ul>
				</div>
			</section>
			<div class="footer" style="height: 90px;overflow: hidden;">
				<div style="float: left;width: 250px;">
					<div>
						<iframe width="250px" height="90px" align="center,center" style="border: 0;vertical-align: bottom;margin: 0;"></iframe>
					</div>
				</div>
				<div style="float: left;width: 760px;"></div>
				<div style="float: left;width: 250px;"></div>
			</div>
		</div>

		<!--footer-->
		<footer id="footer">
			<div class="content">
				<nav class="inner">
					<aside id="describe" class="group">
						<h3>觉唯</h3>
						<p class="describe-text" style="margin-bottom: 2px;">以用户为中心的设计理念，专注于用户体验设计，拥有国内外最新的设计潮流趋势、独特而美的创意视觉、新颖而灵敏的思维意识、极致而生动的交互体验，更有严谨而通俗的技术教程！</p>
						<p>唯然是觉唯网的图片分享社区，以记录美丽、分享美好的创意理念，分享高品质创意、艺术、设计、时尚、插画、摄影、唯美类精美图片。</p>
					</aside>
					<aside class="group">
						<h3>关于</h3>
						<div class="menu-about-container">
							<ul id="menu-about" class="menu">
								<li>
									<a href="#">关于觉唯</a>
								</li>
								<li>
									<a href="#">留言联系</a>
								</li>
								<li>
									<a href="#">友情链接</a>
								</li>
								<li>
									<a href="#">免责声明</a>
								</li>
								<li>
									<a href="#">网站地图</a>
								</li>
							</ul>
						</div>
					</aside>
					<aside class="group">
						<h3>栏目</h3>
						<div class="menu-about-container">
							<ul id="menu-about" class="menu">
								<li>
									<a href="#">用户体验</a>
								</li>
								<li>
									<a href="#">素材下载</a>
								</li>
								<li>
									<a href="#">设计欣赏</a>
								</li>
								<li>
									<a href="#">主题商店</a>
								</li>
								<li>
									<a href="#">唯然灵感</a>
								</li>
							</ul>
						</div>
					</aside>
					<aside class="group">
						<h3>友链</h3>
						<div class="menu-about-container">
							<ul id="menu-about" class="menu">
								<li>
									<a href="#">前端观察</a>
								</li>
								<li>
									<a href="#">设计达人</a>
								</li>
								<li>
									<a href="#">MAKA</a>
								</li>
							</ul>
						</div>
					</aside>
					<aside id="social" class="group">
						<h3>关注</h3>
						<div>
							<ul id="menu-about" class="menu">
								<li>Email:
									<a href="#">javin@jiawin.com</a>
								</li>
								<li class="social-email">
									<form>
										<div class="social-email">
											<input class="email" type="email" name="to" id="to" placeholder="请输入您的邮箱" />
											<input class="submit" type="submit" value="订阅" />
										</div>
									</form>
								</li>
								<li class="social-icon">
									<a class="social-icon-item1" href="#"><i class="glyphicon glyphicon-glass"></i></a>
									<a class="social-icon-item1" href="#"><i class="glyphicon glyphicon-glass"></i></a>
									<a class="social-icon-item1" href="#"><i class="glyphicon glyphicon-glass"></i></a>
									<a class="social-icon-item1" href="#"><i class="glyphicon glyphicon-glass"></i></a>
									<a class="social-icon-item1" href="#"><i class="glyphicon glyphicon-glass"></i></a>
								</li>
							</ul>
						</div>
					</aside>
				</nav>
				<div class="site-info">
					<p class="copyright" style="font-size: 12px;font-family: '微软雅黑';">
						Copyright © 2012-2016
						<a href="#" style="color: #00C3B6;text-decoration: none;">觉唯设计</a>
						Theme by
						<a href="#" style="color: #00C3B6;text-decoration: none;">Javin zhong</a>
						All All Right Reserved. 粤ICP备12073831号-1
					</p>
				</div>
			</div>
		</footer>
		<div id="suspend" class="show1">
			<a><i class="glyphicon glyphicon-chevron-up"></i></a>
		</div>

		<script type="text/javascript">
			//移动端导航栏
			var menu = document.getElementById("menu");
			var navList = document.getElementById("navList");
			var w=null;
			window.onresize=function(){
				w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
				if(w<=1024) {
					navList.style.display = 'none';
					menu.onclick = function() {
						if(navList.style.display == 'none') {
							navList.style.display = 'block';
						} else {
							navList.style.display = 'none';
						}
					}
				} else {
					navList.style.display = 'block';
				}
			}

			//返回顶部
			var backtop = document.getElementById("suspend");
			var b = null;
			backtop.onclick = function() {
				var timer = setInterval(function() {
					window.scrollBy(0, -70);
					if(b == 0) {
						clearInterval(timer);
					}
				}, 15);
			}
			window.onscroll = function() {
				b = document.documentElement.scrollTop || window.pageYOffset;
				if(b <= 20) {
					backtop.style.bottom = '-60px';
				} else {
					backtop.style.bottom = '20px';
				}
				if(b >= 200) {
					document.getElementById("header").style.background = 'black';
				} else {
					document.getElementById("header").style.background = 'rgba(0, 0, 0, 0.5)';
				}
			}
			//登录注册部分
			var login1=document.getElementById("login1");
			var rigest1=document.getElementById("rigest1");
			var main=document.getElementById("main");
			var login=document.getElementById("login");
			var rigest=document.getElementById("rigest");
			var close1=document.getElementById("close1");
			var close2=document.getElementById("close2");
			var change1=document.getElementById("change1");
			var change2=document.getElementById("change2");
			login1.onclick=function(){
				main.style.display='block';
				login.style.zIndex='9997';
				rigest.style.zIndex='9996';
			}
			rigest1.onclick=function(){
				main.style.display='block';
				login.style.zIndex='9996';
				rigest.style.zIndex='9997';
			}
			close1.onclick=function(){
				main.style.display='none';
			}
			close2.onclick=function(){
				main.style.display='none';
			}
			change1.onclick=function(){
				login.style.zIndex='9996';
				rigest.style.zIndex='9997';
				login.style.transform='rotateY(360deg)';
				rigest.style.transform='rotateY(360deg)';
			}
			change2.onclick=function(){
				login.style.zIndex='9997';
				rigest.style.zIndex='9996';
				login.style.transform='rotateY(0deg)';
				rigest.style.transform='rotateY(0deg)';
			}
		</script>
	</body>

</html>
